import { useEffect, useState } from 'react'
import { throttle } from 'underscore'

export function useScrollPosition() {
	const [scrollX, setScrollX] = useState(0)
	const [scrollY, setScrollY] = useState(0)

	useEffect(() => {
		const scrollHandle = throttle(() => {
			const { scrollX, scrollY } = window
			setScrollX(scrollX)
			setScrollY(scrollY)
		}, 100)

		window.addEventListener('scroll', scrollHandle)
		return () => {
			window.removeEventListener('scroll', scrollHandle)
		}
	}, [])

	return { scrollX, scrollY }
}
